import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import HomeOne from '../views/home/HomeOne'
import HomeTwo from '../views/home/HomeTwo'
import AboutOne from '../views/about/AboutOne'
import AboutTwo from '../views/about/AboutTwo'
Vue.use(VueRouter)

const routes = [
    {
        path:"/",
        redirect:"/home"
    },
    {
        path: '/home',
        name: 'home',
        component: Home,
        children: [
            // {
            //     //子路由的默认地址可以写"/"或""
            //     //子路由没有通配符 外面的通配符就包括了里面的乱地址情况
            //     path:"/",
            //     component:HomeTwo
            // },
            {
                path:"/",
                //根据配置的path路径选择初始展示的组件
                //如果子组件path配置的是相对于根地址定义的只能写下面一种 
                redirect:"/homeTwo"
            },
            {
                // path:'/homeOne',
                path: '/homeOne',
                component: HomeOne
            },
            {
                // path:'/homeTwo',
                path: '/homeTwo',
                component: HomeTwo
            }
        ]
    },
    {
        path: '/about',
        name: 'about',
        component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
        children: [
            {
                path:"",
                // redirect:"aboutTwo"
                redirect:"/about/aboutTwo"
            },
            {
                path: "aboutOne",
                component: AboutOne
            },
            {
                path: "aboutTwo",
                component: AboutTwo
            }
        ]

    }
]

const router = new VueRouter({
    routes
})

export default router
